<#assign menuId=5>
<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>所有订单-${Application.systemName!}</title>
        <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>
        <!-- bootstrap 3.0.2 -->
        <link href="../css/bootstrap.min.css" rel="stylesheet" type="text/css" />
        <!-- font Awesome -->
        <link href="../css/font-awesome.min.css" rel="stylesheet" type="text/css" />
        <!-- Ionicons -->
        <link href="../css/ionicons.min.css" rel="stylesheet" type="text/css" />
        <!-- Theme style -->
        <link href="../css/AdminLTE.css" rel="stylesheet" type="text/css" />

        <link href="../css/myself.css" rel="stylesheet" type="text/css" />
        <link rel="stylesheet" href="../css/pagination.css" />
        <script type="text/javascript" src="../js/lib/jquery.min.js"></script>
        <script type="text/javascript" src="../js/jquery.pagination.js"></script>

		<style type="text/css"> 
			#more{
				display: inline-block; 
				margin-left: 25px;
				margin-top: 10px;
			}
			#more a{
				font-weight: bold;
				color: #3882FF;
			}
			.gongchang{
				display: inline-block;
				width: 15%;
				text-align: right;
				font-weight: bold;
			}
			.table{
				margin-bottom: 10px;
			}
			.search{
				width: 100%;
				margin-top: 20px;
				font-size: 14px;
			}
			.search ul{
				width: 100%;
				display: inline-block;
			}
			.ul_bottom{
				width: 100%;
				margin-bottom: 30px;
				display: inline-block;
			}
			.search ul li{
				float: left;
				width: 30%;
				margin-bottom: 10px;
			}
			.search input, .search select{
				border: 1px solid #ccc;
				padding: 0 6px;
				margin-left: 5px;
				height: 30px;
				width: 172px;
			}
			.search select{
				width: 172px;
				height: 30px;
				display: inline-block;
			}
			.dropdown-menu {
			    left: 50%;
			    margin-left: -50px;
			    min-width: 100px;
			}
			i{
				cursor: pointer;
			}
			
			
        	
        	
        	
        	
		</style>
    </head>
    <body class="skin-blue">
        <!-- header logo: style can be found in header.less -->
        <#include "../header.html"/>
        <div class="wrapper row-offcanvas row-offcanvas-left">
            <!-- Left side column. contains the logo and sidebar -->
            <#include "../menu.html"/>

            <!-- Right side column. Contains the navbar and content of the page -->
           <aside class="right-side">
           	<section class="content-header">
                    <h1>所有订单</h1>
            </section>
            <section class="content">
            	<div class="row">
            		<div class="col-md-12">
            			<div class="box">
				            <div class="clearfix search-div center">
				            	<form id="all_order_search" action="../allOrder/list" method="get">
				            	<span>
				            		<div class="sidebar-form order-input fl">
					                    <div class="input-group" >
					                        <i class="fa fa-search" style="position:absolute;top:11px;left:5px;"></i>
					                        <input id="customer_name" name="name" value="${name!}" style="padding: 5px 20px;" type="text" class="form-control" placeholder="请输入客户名进行搜索">
											<span id="seach" class="input-group-addon " style="border: none; cursor: pointer;">搜索</span>
					                    </div>
					               </div>
				            	</span>
				               	<span id="more">
				               		<a href="javascript:;">
				               			更多筛选条件
				               			<i id="arrow_1" class="fa fa-angle-down" style="font-weight: bold;"></i>
				               		</a>
				               	</span>
				               	
						       	<div class="clearfix"></div>
						       	<div class="search">
						       		<ul class="ul_top">
						       			<li>
						       				<span>最近订单</span>
											<select id="time" name="time">
												<option value="0" >全部订单</option>
												<#if (time??)&&time==7>
												<option value="7" selected="selected" >一周内</option>
												<#else>
												<option value="7" >一周内</option>
												</#if>
												<#if (time??)&&time==90>
												<option value="90" selected="selected">三月内</option>
												<#else>
												<option value="90" >三月内</option>
												</#if>
												<#if (time??)&&time==365>
												<option value="365" selected="selected">一年内</option>
												<#else>
												<option value="365" >一年内</option>
												</#if>
											</select>
						       			</li>
						       			<li>
						       				<span>订单编号</span>
											<input id="orderCode" name="orderCode" value="${orderCode!}" type="text" placeholder="请输入订单编号" />
						       			</li>
						       			<li>
						       				<span>工厂名称</span>
											<input id="factoryName" name="factoryName" value="${factoryName!}" type="text" placeholder="请输入工厂名称" />
						       			</li>
						       		</ul>
						       		<ul class="ul_bottom">
						       			<li>
						       				<span>销售经理</span>
											<input id="saleName" name="saleName" value="${saleName!}" type="text" placeholder="输入销售经理名字" />
						       			</li>
						       			<li>
						       				<span>项目经理</span>
											<input id="PMName" name="PMName" value="${PMName!}" type="text" placeholder="输入项目经理名字" />
						       			</li>
						       			<li>
						       				<span>设计师</span>
											<input id="designerName" name="designerName" value="${designerName!}" style="margin-left: 20px;" type="text" placeholder="输入设计师名字" />	
						       			</li>
						       		</ul>
						       	</div>
						       	</form>
						           	<table class="table table-bordered text-center order-table">
						               	<tbody>
						                   	<tr>
						                       	<td style="border: none; text-align: left;" width="35%">
						                       		客户信息
						                       	</td>
						                       	<td style="border: none;" width="21%">款式数量</td>
						                       	<td style="border: none;" width="22%">项目人员</td>
						                       	<td style="border: none;" width="22%">
						                       		<div class="dropdown" style="cursor: pointer;">
														<div  class=" dropdown-toggle" id="dropdownMenu1" data-toggle="dropdown">
															订单状态
															<i id="arrow_2" class="fa fa-angle-down" style="color: #3882FF; font-weight: bold;"></i>
														</div>
														<ul class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1">
															<li role="presentation">
																<a role="menuitem" tabindex="-1" href="list">全部订单</a>
															</li>
															<li role="presentation">
																<a role="menuitem" tabindex="-1" href="list?orderStatus=1">设计</a>
															</li>
															<li role="presentation">
																<a role="menuitem" tabindex="-1" href="list?orderStatus=2">打样</a>
															</li>
															<li role="presentation">
																<a role="menuitem" tabindex="-1" href="list?orderStatus=3">大货</a>
															</li>
															<li role="presentation">
																<a role="menuitem" tabindex="-1" href="list?orderStatus=0">已关闭</a>
															</li>
														</ul>
													</div>
						                       </td>
						                   </tr>
						               </tbody>
						           </table>
						         <#list allOrderDtos as allOrderDto>
						           	<table class="table text-center table-bordered order-list">
					                   	<tr>
					                       	<td colspan="5" class="left-text">
					                           <span>${allOrderDto.createAt!}</span>
					                           <span>订单号：${allOrderDto.code!}</span>
					                           <#if allOrderDto.factories??>
					                           		<#list allOrderDto.factories as factory>
					                           			<span class="gongchang">${factory!}&nbsp;&nbsp;</span>
					                           		</#list>
					                           </#if>
					                           <#if allOrderDto.remainingTime?? && allOrderDto.remainingTime gt 0>
						                           <b class="fr six-font">剩余${allOrderDto.remainingTime!}天</b>
						                           <#elseif allOrderDto.remainingTime?? && allOrderDto.remainingTime lt 0>
						                           <b class="fr six-font red">超期${allOrderDto.remainingTime?abs}天</b>
						                           <#elseif allOrderDto.remainingTime??>
						                           <b class="fr six-font">剩余${allOrderDto.remainingTime!}天</b>
						                       </#if>
					                       	</td>
					                   	</tr>
				                        <tr>
					                        <td width="35%">
					                           <#if (allOrderDto.level!)=="V1">
						                            <i class="iconfont fl">&#xe6eb;</i>
						                            <#elseif allOrderDto.level=="V2">
						                            <i class="iconfont fl">&#xe6ed;</i>
						                            <#else>
						                            <i class="iconfont fl">&#xe6e9;</i>
						                        </#if>
					                            <div  class="order-text">
					                            <p>
					                            <span id="name">${allOrderDto.abbreviation!}（${allOrderDto.fullname!}）</span>
					                            <a href="${allOrderDto.web}">
					                            	<i class="iconfont">&#xe6ee;</i>
					                            </a>
					                            <#if allOrderDto.attachment?size!=0>
					                            <a class="download"><i class="iconfont" data-toggle="modal" data-target="#myModal">&#xe6ef;</i></a>
												
												
												<div class="modal fade"  tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
													<div class="modal-dialog down_load">
														<div class="modal-content">
															<div class="modal-header">
																<button type="button" class="close" data-dismiss="modal" aria-hidden="true">
																	&times;
																</button>
																<h4 class="modal-title">
																	下载列表
																</h4>
															</div>
															<div class="modal-body">
																<ul>
																	<#list allOrderDto.attachment as attach>
																	<li>
																		<div class="clearfix">
																			<a href="../customer/downFile?filename=${attach.businessFile!}"><img class="pull-left" src="../img/file.png" style="width: 60px; height: 60px; border-radius: 10px;"/></a>
																			<span class="pull-left" title="${attach.businessFile?substring(13)!}">${attach.businessFile?substring(13)!}</span>
																		</div>
																	</li>
																    </#list>
																</ul>
															</div>
															<div class="modal-footer">
																<button type="button" class="btn btn-default" data-dismiss="modal">
																	关闭
																	<btton>
															</div>
														</div><!-- /.modal-content -->
													</div><!-- /.modal -->
												</div>
												</#if>
					                            </p>
					                            <p>
					                            	产品分类：
					                            	<#list allOrderDto.productCategory as category>
					                            		<span>${category!}&nbsp;&nbsp;</span> 
					                            	</#list>
					                            </p>
					                            <p>目标人群：${allOrderDto.targetConsumer!}</p>
					                            <p>
					                            	<#list allOrderDto.styleLabel as label>
					                           		 	<span class="bule-border">${label!}</span>
					                           		</#list>
					                            </p>
					                            </div>
					                        </td>
					                        <td width="21%">${allOrderDto.count!}</td>
					                       	<td width="22%">
					                       		<#list allOrderDto.participants as participant>
					                       		<div>${participant.roleName!}：${participant.name!}</div>
					                       		</#list>
					                       	</td>
					                       	<td width="22%" style="color: red;">${allOrderDto.orderStatus!}</td>
					       				</tr>
						           	</table>
						        </#list>
							    <div class="clearfix" style="margin: 50px 0 35px;">
				                    <ul class="pagination pagination-sm no-margin pull-right">
				                        <#if splitPage??> ${splitPage?replace("{url}","${url!}")}
										</#if>
				                    </ul>
				                </div>
				           	</div>
            			</div>
            		</div>
            	</div>
            </section>
            </aside><!-- /.right-side -->
            
            
      
            
        </div><!-- ./wrapper -->
        
        <style type="text/css">
        
        </style>
        <!-- jQuery 2.0.2 -->
        <script src="../js/jquery.min.js" type="text/javascript"></script>
        <!-- Bootstrap -->
        <script src="../js/bootstrap.min.js" type="text/javascript"></script>
        <!-- AdminLTE App -->
        <script src="../js/AdminLTE/app.js" type="text/javascript"></script>
        <!-- AdminLTE for demo purposes -->
        
        
       	<script type="text/javascript">
       		$('.search').hide();
       		
       		$("#more").click(
				function(){
						if($('.search').css('display')=='none'){
							$('.search').show();
							$('#arrow_1').attr('class', 'fa fa-angle-up');
						}
						else{
							var name = $('#customer_name').val();
							$('#all_order_search')[0].reset();
							$('#customer_name').val(name);
							$('.search').hide();
							$('#arrow_1').attr('class', 'fa fa-angle-down');
						}
					}
				
			);
       		$(function(){
				$('.download').click(function(){
					console.log($(this));
					$(this).parent().next().modal('show');
				});
				//发出搜索请求
				$('#seach').click(function(){
					$('#all_order_search').submit();
				});
				//更多搜索条件的显示
				if(($('#time').val()!=undefined && $('#time').val()!=0)||$('#orderCode').val()!=""||$('#factoryName').val()!=""||$('#saleName').val()!=""||$('#PMName').val()!=""||$('#designerName').val()!=""){
					$('.search').show();
				}
			})
       	</script>

    </body>
</html>
